<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
	<head>
		<title>Tumbler - Story: ${story.name()}</title>
		<link href="${resources}/report.css" rel="stylesheet" type="text/css" />
	</head>
	<body>
		<div id="header">
			<table>
				<tbody>
					<tr>
						<td>
							<img src="${resources}/tumbler.jpg" alt="Tumbler" />
						</td>
						<td>
							<span class="title_const">Tumbler report for:&nbsp;</span>
							<span class="title_name">${story.name()}</span>
							<hr />
							<span class="narrative">${narrative}</span>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
		<div id="summary">
			<table class="report">
				<thead>
					<tr>
						<th colspan="3" class="status">Run summary</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<td class="status">
							<img src="${resources}/PASSED.png" alt="PASSED" title="PASSED" />
						</td>
						<td class="status">
							<img src="${resources}/FAILED.png" alt="FAILED" title="FAILED" />
						</td>
						<td class="status">
							<img src="${resources}/PENDING.png" alt="PENDING" title="PENDING" />
						</td>
					</tr>
					<tr>
						<td class="status">${runStatistics.passed()}</td>
						<td class="status">${runStatistics.failed()}</td>
						<td class="status">${runStatistics.pending()}</td>
					</tr>
				</tbody>
			</table>
		</div>
		<div id="report">
			<table class="report">
				<thead>
					<tr>
						<th>${story.name()} should:</th>
						<th>Description</th>
						<th class="status">Run status</th>
					</tr>
				</thead>
				<tbody>
					<#list scenarios as scenario>										
					<tr>
						<td>${scenario.name()}</td>
						<td>
							${keywords.keyword("Given")} ${scenario.given()}
							<br />
							${keywords.keyword("When")} ${scenario.when()}
							<br />
							${keywords.keyword("Then")} ${scenario.then()}
						</td>
						<td class="status">
							<img src="${resources}/${scenario.status()}.png" alt="${scenario.status()}" title="${scenario.status().details()}" />
						</td>
					</tr>					
					</#list>
				</tbody>
			</table>
		</div>
		<div id="footer">
			<p>
				Generated by
				<a href="http://tumbler-glass.googlecode.com">Tumbler</a>
			</p>
		</div>
	</body>
</html>